<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title></title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<style type="text/css">
		*{margin: 0;padding: 0;}
		img{display: none;}
	</style>
</head>
<body>
<canvas id="canvas" width="" height=""></canvas>
<audio src="1.mp3" preload="" id="music"></audio>
<script type="text/javascript">
for (var i = 1; i <= 12; i++) {
	var img=document.createElement('img');
	img.src='img/'+'white.jpg';
	document.body.appendChild(img);
}
for (var i = 1; i <= 4; i++) {
	var img=document.createElement('img');
	img.src='img/'+'black.jpg';
	document.body.appendChild(img);
}	
</script>
<script type="text/javascript" src="js.js"></script>
</body>
</html>